L.InputBox = L.Class.extend({
    initialize: function (map) {
        this._map = map;
        this._popupPane = map._panes.popupPane;

        this._container = map.options.drawControlTooltips ? L.DomUtil.create('div', 'leaflet-draw-tooltip', this._popupPane) : null;

        L.DomEvent.disableClickPropagation(this._container);
        L.DomEvent.on(this._container, 'click', function (e) {
            e.preventDefault();
        });

        this._singleLineLabel = false;
    },

    dispose: function () {
        if (this._container) {
            this._popupPane.removeChild(this._container);
            this._container = null;
        }
    },

    updateContent: function (labelText, rel, callback) {
        if (!this._container) {
            return this;
        }

        this._container.innerHTML =
			'<div class="editor"><input type="text" class="project_input_shapename" value="' + labelText + '"></div>';

        //var container = this._container;

        var _this = this;
        setTimeout(function () {
            $(_this._container).find("input").focus();
        }, 100);

        $(this._container).find("input").on("focusout", function () {
            callback(rel, $(this).val());
            $(this).off("focusout");
            _this.dispose();
            _this = null;
        });

        $(this._container).find("input").on("keypress", function (e) {
            if (e.which == 13) {
                $(this).trigger("focusout");
            }
        });


        return this;
    },

    updatePosition: function (latlng) {
        var pos = this._map.latLngToLayerPoint(latlng),
			tooltipContainer = this._container;

        pos.y = pos.y - 10;

        if (this._container) {
            L.DomUtil.setPosition(tooltipContainer, pos);
            tooltipContainer.style.visibility = 'inherit';
        }

        return this;
    },

});